import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import { createHtmlPlugin } from 'vite-plugin-html'
import postcssPresetEnv from 'postcss-preset-env'
import postcssPxtorem from 'postcss-pxtorem'
import { terser } from 'rollup-plugin-terser';

export default defineConfig(({ command, mode }) => {
    const env = loadEnv(mode, process.cwd(), "")
    return {
        resolve: {
            alias: {
                '@': path.resolve(__dirname, './src')
            },
            extensions: ['.js', '.jsx', '.json'],
        },
        plugins: [
            // {
            //   order: 1, // 使用 order 选项指定生成顺序
            //   transform: (html) => html,
            // },
            vue(),
            AutoImport({
                resolvers: [ElementPlusResolver()],
                imports: [
                    'vue',
                    'vue-router',
                ],
            }),
            Components({
                resolvers: [ElementPlusResolver()],
            }),
            createHtmlPlugin({
                minify: true,
                template: 'index.html',
                inject: {
                    data: {
                        title: '',
                    }
                },
            }),
        ],
        css: {
            // 预处理器的配置选项
            // preprocessorOptions: {
            //   scss: {
            // // 全局变量或引入全局变量名
            // additionalData: `$injectedColor: orange;`
            //   }
            // },
            postcss: {
                plugins: [
                    postcssPresetEnv(),
                    postcssPxtorem({
                        rootValue: 200, // 根据你的需要设定一个rootValue，设计稿中的px值除以这个rootValue会转换成rem单位  正常32 后面调一调
                        propList: ['*'], // 需要做转换的属性*，表示全部  
                        minPixelValue: 2, // 设置要替换的最小像素值  
                        selectorBlackList: ['-nopx'], // 黑名单，可以通过正则表达式排除某些选择器，不进行px转换  
                    })
                ]
            }
        },
        server: {
            // host: '0.0.0.0',
            open: true, //vite项目启动时自动打开浏览器
            proxy: {
              '/api': {
                // 配置接口调用目标地址
                target: env.VITE_BASE_API,
                // 当进行代理时，在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题
                changeOrigin: true,
                // 替换target中的请求地址，请求时以 /api 开头
                rewrite: path => path.replace(/^\/api/, ''),
                
               }
            }
        },
        build: {
            // 构建后是否生成 source map 文件, boolean | 'inline' | 'hidden'
            sourcemap: false,
            //自定义底层的 Rollup 打包配置
            rollupOptions: {
                // external: ['@chenfengyuan/vue-qrcode'],
                output: {
                    chunkFileNames: 'static/js/[name]-[hash].js',
                    entryFileNames: "static/js/[name]-[hash].js",
                    assetFileNames: "static/[ext]/[name]-[hash].[ext]"
                },
                plugins: [
                    terser({
                      compress: {
                        drop_console: true, // 关闭所有的 console.log 打印
                      },
                    }),
                  ],
            
            },
        }
    }
})